<template>
	<view class="con">

		<view class="logo">
			<image src="../../static/logo.png" mode="widthFix"></image>
		</view>

		<view class="form">
			<form @submit="formSubmit">
				<view class="form-item">
					<text class="iconfont icon-xiaoyouxi"></text>
					<input type="text" placeholder="请输入用户名" name="name">
				</view>
				<view class="form-item">
					<text class="iconfont icon-xiaoyouxi"></text>
					<input type="text" placeholder="请输入账号" name="account_num">
				</view>
				<view class="form-item">
					<text class="iconfont icon-xiaoyouxi"></text>
					<input type="password" placeholder="请输入密码" name="password">
				</view>
				<view class="form-item">
					<text class="iconfont icon-xiaoyouxi"></text>
					<input type="password" placeholder="请重复密码" name="password2">
				</view>


				<button class="reg_btn" type="default" form-type="submit">立即注册</button>
			</form>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			refreshImg() {
				this.codeUrl = this.codeUrl + '?' + Math.random()
			},
			formSubmit(e) {
				// console.log(e.detail.value);
				let name = e.detail.value.name;
				let password = e.detail.value.password;
				let password2 = e.detail.value.password2;
				let account_num = e.detail.value.account_num;


				uni.request({
					url: 'https://laijunlin.xyz/index/user/register',
					method: 'POST',
					data: {
						name,
						password,
						password2,
						account_num,
					},
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						// console.log(res);
						uni.showToast({
							title: res.data,
							icon: 'success'
						});
						
						if (res.data == "注册成功") {
							setTimeout(() => {
								uni.reLaunch({
									url: '/pages/login/login'
								})
							}, 1500)
						}
					}
				});
			}
		},
		mounted() {
			
			
		}
	}
</script>

<style scoped lang=scss>
	.con {
		padding: 0 30rpx;
	}

	.logo {
		width: 100%;
		display: flex;
		justify-content: center;
		margin-top: 60rpx;

		image {
			width: 80%;
		}
	}

	.form {
		margin-top: 60rpx;

		.login_btn,
		.reg_btn {
			width: 60%;
			background-color: #4d89b6;
			color: #fff;
			margin-top: 60rpx;
			border-radius: 20px;

		}

		.reg_btn {
			background-color: red;
		}
	}

	.form-item {
		width: 80%;
		display: flex;
		border-bottom: 1px solid #999;
		margin: 0 auto 30rpx;

		.iconfont {
			width: 100rpx;
			height: 100rpx;
			text-align: center;
			line-height: 100rpx;
			font-size: 36rpx;
		}

		input {
			flex: 1;
			height: 100rpx;
			box-sizing: border-box;
			padding-left: 10rpx;
		}

		.code {
			width: 200rpx;
			height: 80rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>
